<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <table border="1">
        <tr>
            <td><b>块级元素</b></td>
            <td><b>内联元素</b></td>
        </tr>
        <tr>
            <td>块元素会在页面中独占一行（自上而下垂直排列）</td>
            <td>行内元素不会独占页面中的一行，只占自身大小</td>
        </tr>
        <tr>
            <td>可以设置width，height属性</td>
            <td>行内元素设置width，height无效</td>
        </tr>
        <tr>
            <td>一般块级元素可以包含行内元素和其他块级元素</td>
            <td>一般内联元素包含内联元素不包含块级元素</td>
        </tr>
    </table>

    <p><b>常见块级元素</b> <br> div ，form ，h1-h6 ，hr ，p ，table ，ul 等</p>
    <p><b>常见内联元素</b> <br> a ，b ，em ，i ，span ，strong 等</p>
    <p><b>行内块级元素（特点：不换行，能够识别宽高）</b> <br> button ，img ，input 等</p>
    
</body>
</html>